<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<!--移动端头部-->
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<!--公共样式-->
		<link rel="stylesheet" type="text/css" href="css/common.css" />
		<!--CSS样式-->
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<link rel="stylesheet" type="text/css" href="css/swiper-3.4.2.min.css"/>
		<!--rem插件-->
		<script src="js/rem.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/swiper-3.4.2.min.js" type="text/javascript" charset="utf-8"></script>
	</head>

	<body>
		<!--头部-->
		<header>
			<span class="iconfont">&#xe614;</span>
			<h3>优惠商城</h3>
			<span class="iconfont">&#xe783;</span>
		</header>
		<!--内容-->
		<main>

			<div class="main-banner swiper-container" id="banner">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<img src="img/切片_10.jpg" />
					</div>
					<div class="swiper-slide">
						<img src="img/切片_28.jpg" />
					</div>
					<div class="swiper-slide">
						<img src="img/切片_30.jpg" />
					</div>
				</div>
			</div>
			<ul>
				<li>
					<img src="img/切片_13.jpg" alt="" />
					<p>超值大牌</p>
				</li>
				<li>
					<img src="img/切片_15.jpg" alt="" />
					<p>新品特惠</p>
				</li>
				<li>
					<img src="img/切片_17.jpg" alt="" />
					<p>免费试用</p>
				</li>
				<li>
					<img src="img/切片_19.jpg" alt="" />
					<p>一元云购</p>
				</li>
				<li>
					<img src="img/切片_21.jpg" alt="" />
					<p>热销商品</p>
				</li>
			</ul>
<img src="img/切片_28.jpg" />
<img src="img/切片_30.jpg" />
		</main>
		<!--尾部-->
		<footer>
			<ul>
				<li class="footr-active">
					<span class="iconfont">&#xe69c;</span>
					<p>优惠</p>
				</li>
				<li>
					<span class="iconfont">&#xe539;</span>
					<p>热寻</p>
				</li>
				<li>
					<span class="iconfont">&#xe633;</span>
					<p>清仓</p>
				</li>
				<li>
					<span class="iconfont">&#xe661;</span>
					<p>购物车</p>
				</li>
				<li>
					<span class="iconfont">&#xe688;</span>
					<p>我的</p>
				</li>
			</ul>
		</footer>
	</body>

</html>
<script type="text/javascript">
    new Swiper("#banner", {
        autoplay: 2000,
//      effect: "cube"
    })
</script>